var index = 0

var lis = document.querySelectorAll('.right_pic li')
var bigPic = document.querySelector('.content_left_pic img')

var picBig = ['./images/b1.png', './images/b2.png', './images/b3.png', './images/b4.png']
var leftPicMini = ['./images/smm1.png', './images/smm2.png', './images/smm3.png', './images/smm4.png']
var leftPicBig = ['./images/smm1_b.png', './images/smm2_b.png', './images/smm3_b.png', './images/smm4_b.png']

// 自动轮播
var flag

function setRun() {
  flag = setInterval(function() {
    clearClass()
    index++
    if (index >= lis.length) {
      index = 0
    }
    setStyle()
  }, 2000)
}

function theTu(num) {
  clearClass()
  index = num
  setStyle()
}

// 点击向上
function btnTop() {
  lis[index].children[0].setAttribute('src', leftPicMini[index])
  clearClass()
  index--
  if (index < 0) {
    index = 3
  }

  setStyle()

}

// 点击向下
function btnBottom() {
  clearClass()
  index++
  if (index >= lis.length) {
    index = 0
  }
  setStyle()
}

// 清除轮播图放大
function clearClass() {
  lis[index].children[0].setAttribute('src', leftPicMini[index])
  for (var i = 0; i < lis.length; i++) {
    lis[i].removeAttribute('class')
  }
}

// 公共代码
function setStyle() {
  lis[index].children[0].setAttribute('src', leftPicBig[index])
  bigPic.setAttribute('src', picBig[index])
  lis[index].setAttribute('class', 'show')
  clearRun()
}

// 触发事件，清除自动轮播
function clearRun() {
  clearInterval(flag)
  setRun()
}

setRun()
